﻿@using custom_edit_form.Data
@using custom_edit_form.Models
@inject AppointmentService ApptService

<style>
    form label.width100 {
        width: 100%;
    }
</style>

<h4>Custom edit form</h4>

<EditForm Model="@Appointment" OnValidSubmit="@SaveAppointment">
    <DataAnnotationsValidator />
    <label class="width100">
        Title:<br />
        <TelerikTextBox @bind-Value="@Appointment.Title" Width="100%" />
    </label>
    <br />
    <input type="checkbox" id="allDayCb" class="k-checkbox" @bind="@Appointment.IsAllDay">
    <label class="k-checkbox-label" for="allDayCb">All day appointment</label>

    @if (Appointment.IsAllDay)
    {
        <TelerikDateRangePicker @bind-StartValue="@Appointment.Start"
                                @bind-EndValue="@Appointment.End" />

    }
    else
    {
        <label class="width100">
            Start:<br />
            <TelerikDateTimePicker @bind-Value="@Appointment.Start" Width="100%" />
        </label>
        <label class="width100">
            End:<br />
            <TelerikDateTimePicker @bind-Value="@Appointment.End" Width="100%" />
        </label>
    }

    <label class="width100">
        Description:<br />
        <TelerikTextBox @bind-Value="@Appointment.Description" Width="100%" />
    </label>
    <label class="width100">
        Notes:<br />
        <TelerikTextBox @bind-Value="@Appointment.Notes" Width="100%" />
    </label>


    <ValidationSummary />

    <TelerikButton Primary="true">Save</TelerikButton>

    @* These buttons do not invoke validation, you can always delete an appointment or stop editing *@
    <TelerikButton OnClick="@CancelEditing" ButtonType="ButtonType.Button">Cancel</TelerikButton>
    <TelerikButton OnClick="@DeleteAppointment" ButtonType="ButtonType.Button">Delete</TelerikButton>

</EditForm>

@code{
    //communcation with the parent component where the scheduler is
    [Parameter] public Appointment Appointment { get; set; }
    [Parameter] public EventCallback<string> OnAppointmentChanged { get; set; }

    async void SaveAppointment()
    {
        ApptService.UpdateAppointment(Appointment);
        await OnAppointmentChanged.InvokeAsync(Appointment.Title);
    }

    async void DeleteAppointment()
    {
        ApptService.DeleteAppointment(Appointment);
        await OnAppointmentChanged.InvokeAsync(Appointment.Title);
    }

    async void CancelEditing()
    {
        await OnAppointmentChanged.InvokeAsync(Appointment.Title);
    }
}